extends ../inc/layout

block main
	#main.container
		#main-inner
			#edit_error
				if edit_error
					.alert.alert-danger(role='alert')
						span #{edit_error}

			#writeBlog.row
				form.form-horizontal(role='form',enctype='multipart/form-data' action='http://file.api.weixin.qq.com/cgi-bin/media/upload', method='post')
					.form-group
						label 文件类型
						input(type='hidden', name='access_token', value='#{accessToken}', id='accessToken')
						select.form-control(name='type', id='type')
							option(value='image') 图片 
							option(value='voice') 语音 
							option(value='video') 视频 
							option(value='thumb') 缩略图 

					.form-group
						label(for='content') 选择文件
						input(type='file', name='media', id='fileupload')

					button.btn.btn-primary(type='submit') &nbsp;上&nbsp;&nbsp;传&nbsp;
					button.btn.btn-primary.start(type='button', id='triggerUpload') &nbsp;异步上传&nbsp;


block script
	script(src='/assets/file-upload/cors/jquery.postmessage-transport.js')
	script(src='/assets/file-upload/cors/jquery.xdr-transport.js')
	script(src='/assets/file-upload/vendor/jquery.ui.widget.js')
	script(src='/assets/file-upload/jquery.iframe-transport.js')
	script(src='/assets/file-upload/jquery.fileupload.js')
	script(src='/assets/bootstrap-3.2.0/js/bootstrap.min.js')
	script.
		$(function () {
			var url = 'http://file.api.weixin.qq.com/cgi-bin/media/upload';
			var accessToken = $('#accessToken').val();
			var type = $('#type').val();
			var uploader = $('#fileupload').fileupload({
				url: url,
				formData: {access_token: accessToken, type: type},
				dataType: 'json',
				autoUpload: false,
				maxNumberOfFiles : 1,
				// maxFileSize: 5000000,
				add: function (e, data) {
					$("#triggerUpload").click(function () {
						data.submit();
					})
				},
				done: function (e, data) {
					console.log('ok');
				}
			}, {
				xhrFields: {
					withCredentials: true
				}
			});
		});